{% load i18n %}
<div class="btn-group export">
    <a class="dropdown-toggle btn btn-default btn-sm" data-toggle="dropdown" href="#">
        <i class="fa fa-share"></i> 导入 <span class="caret"></span>
      </a>
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
          <li>
              <a data-toggle="modal" data-target="#export-modal-excel">
                  <i class="fa fa-arrow-circle-up"></i> 导入 Excel
              </a>
          </li>
    </ul>
    <script>
        function checkFile(){
            var excelFile = $("#excelFile").val()
            var excelFileType = excelFile.substring(excelFile.lastIndexOf(".")+1).toLowerCase()
            if(excelFile == ""){
                alert("您还没有上传Excel文件！")
                return false
            }
            if(excelFileType != "xls" && excelFileType != "xlsx"){
                alert("请上传Excel类型的文件！")
                return false
            }
            return true
        }
    </script>
    <div id="export-modal-excel" class="modal fade">
      <div class="modal-dialog">
        <div class="modal-content">
          <form method="post" action="" enctype="multipart/form-data" onsubmit="return checkFile()">
              {% csrf_token %}
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">导入 Excel</h4>
              </div>
              <div class="modal-body">
                  <label class="">
                    <input type="file" name="excelFile" id="excelFile" class=""/>
                  </label>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Close" %}</button>
                <button class="btn btn-success" type="submit">
                    <i class="fa fa-share"></i> 导入
                </button>
              </div>
          </form>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dalog -->
    </div><!-- /.modal -->
</div>